<?php
$puid = $_GET['puid'];
include_once("../untils/conn.php");
$sql = "SELECT * FROM shopsy WHERE puid = '$puid'";
$result = mysqli_query($con, $sql);

if ($result->num_rows > 0) {
  // 输出数据
  while($row = $result->fetch_assoc()) {
    // 获取每个字段的值
    $banner = $row["banner"];
    $link = $row["link"];
    $banner_one = $row["banner_one"];
    $link_one = $row["link_one"];
    $banner_two = $row["banner_two"];
    $link_two = $row["link_two"];
    $shop_name = $row["shop_name"];
  }
} else {
  //   echo "未找到匹配的记录";
}
?>



<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maxi-mum-scale=1.0,user-scalable=no" name="viewport" />
  <title><?php echo $shop_name ?></title>
  <link rel="stylesheet" href="../other/main.css">
</head>

<body>
  <div class="focus">
    <ul>
      <li><a href="<?php echo $link ?>" target="_blank"><img src="../merchant/<?php echo $banner ?>" ></a></li>
      <li><a href="<?php echo $link_one ?>" target="_blank"><img src="../merchant/<?php echo $banner_one ?>"></a></li>
      <li><a href="<?php echo $link_two ?>" target="_blank"><img src="../merchant/<?php echo $banner_two ?>"></a></li>
      <li><a href="<?php echo $link ?>" target="_blank"><img src="../merchant/<?php echo $banner ?>"></a></li>
      <li><a href="<?php echo $link_one ?>" target="_blank"><img src="../merchant/<?php echo $banner_one ?>"></a></li>
    </ul>
    <!-- 小圆点 -->
    <ol>
      <li class="current"></li>
      <li></li>
      <li></li>
    </ol>
  </div>
  <!--公告-->
  <div class="gonggao">
    <div class="gonggao-left">
      <img src="../img/gonggao.png">
    </div>
    <div class="gonggao-right">
      所有套餐需激活首充固定金额才可以享受优惠政策 </div>
    <div class="clear"></div>
  </div>
  <!--导航-->
   <?php
      include_once("../untils/conn.php");
        $sql = "SELECT * FROM kefu";
    $result = mysqli_query($con, $sql);
    
    
     if ($result->num_rows > 0) {
      // 输出数据
      while($row = $result->fetch_assoc()) {
        // 获取每个字段的值
        $chaxun = $row["chaxun"];
        

       
      }
    } else {
    //   echo "未找到匹配的记录";
    }
      ?>
      <!--查询导航-->
 <div class="dh" style="height:100px;margin-top:8px;  display: flex;">
      <a  href="../odersearch.php" style="float:left; flex: 1;">
          <img style="float:right; margin-top:40px;width:80px" src="../img/cx.png">
          <div class="bthcx"style="color: #fff;">订单查询
           <div calss="xian" style="width:40px; height:5px; border-radius: 10px; background:#fff"></div>
           <div style="margin-top:20px;width: 70px;height: 22px;text-align: center;border-radius: 20px;background: rgba(255, 255, 255, 1); color:#366EF6;   font-size: 10px;padding-top: 3px;">立即查询</div>
           <!--<img style="float:right;" src="img/cx.png">-->
          </div>
           
      </a>
       <a href="kf.php?puid=<?php echo $puid ?>" style="float:left; flex: 1;">
          <img style="float:right; margin-top:40px;width:80px;margin-right:10px ;" src="../img/kf.png">
          <div class="bthkf"style="">在线客服
          <div calss="xian" style="width:40px; height:5px; border-radius: 10px; background:#fff"></div> 
          <div style="margin-top:20px;width: 70px;height: 22px;text-align: center;border-radius: 20px;background: rgba(255, 255, 255, 1); color:#366EF6;   font-size: 10px;padding-top: 3px;">立即联系</div>
          </div>
          
      </a>
  </div>

  
  <!--分类-->
  <!--<div class="height" style="margin-top: -3px;" ></div>-->
  <div class="fenlei">
    <div class="banner">限量领取<a class="right" style="float:right">流量领不停 免费送到家</a></div>
    <div class="navall">
      <!--分类结束-->
      <!-- PHP获取产品 -->
      <?php
        include_once("../untils/conn.php");
        mysqli_query($con, "set names utf8");
        $yysname = $_GET['yys'];
        $puid = $_GET['puid'];
        
        if ($con) {
          //选择数据库
          if ($db) {
            //获取数据总行数
            $goodsta_sql = "SELECT spid, status FROM goodsta WHERE puid='$puid'";
            $goodsta_data = mysqli_query($con, $goodsta_sql);
            $goodsta = array();
            while ($goodsta_row = mysqli_fetch_array($goodsta_data)) {
              $goodsta[$goodsta_row['spid']] = $goodsta_row['status'];
            }
            $sql = "SELECT * FROM list WHERE yys='$yysname' AND state=0  ORDER BY id DESC";
            $data = mysqli_query($con, $sql);
            $sortsql = "select * from sort  ORDER BY sortid DESC";
            $sortdata = mysqli_query($con, $sortsql);
        ?>
        
            <ul class="box">
              <?php
              while ($sortrow = mysqli_fetch_array($sortdata)) {
              ?> <?php $dqid = $sortrow["yys"] ?>
                <li class="cat_child">
                  <a href="?yys=<?php echo $sortrow["yys"] ?>&puid=<?php echo $puid ?>" class="<?php echo $yysname == $dqid ? 'active' : '' ?>"><?php echo $sortrow["yys"] ?></a>
                </li>
              <?php
              }
              ?>
            </ul>
            <?php
            while ($row = mysqli_fetch_array($data)) {
              if (isset($goodsta[$row['id']]) && $goodsta[$row['id']] == 1) {
                continue;
              }
            ?>
              <div class="alllist">
                <img class="alllistl" src="<?php echo $row["zhutu"] ?>" onclick="javascript:location.href='../shop/links.php?goodsid=<?php echo $row["id"]; ?>&puid=<?php echo $puid ?>'" />
                <div class="alllistc" onclick="javascript:location.href='../shop/links.php?goodsid=<?php echo $row["id"]; ?>&puid=<?php echo $puid ?>'">
                  <div class="listc1 ellipse1"><span class="shouquan">授权专营</span><?php echo $row["name"] ?></div>
                  <div class="listc1 ellipse1"><?php echo $row["other"] ?><time><?php echo $row["ltime"] ?></time>
                    <empty><?php echo $row["xuanhao"] ?></empty>
                  </div>
                  <div class="listc2 ellipse1"><span><?php echo $row["jieshao"] ?></span></div>
                  <div class="pull-left"><span class="baoyou"><?php echo $row["baoyou"] ?></div>
                </div>
                <div class="alllistr1" onclick="javascript:location.href='../shop/links.php?goodsid=<?php echo $row["id"]; ?>&puid=<?php echo $puid ?>'">
                  立即领取</div>
              </div>
            <?php
            }
          }
        }
        ?>
    </div>
  </div>
  <input type="hidden" id="is_login" value="-1">
  <div class="bottom1">
    <div class="height1"></div>
  </div>
</body>
<script>
  /** @format */
  window.addEventListener('load', function() {
    // alert(1);
    // 1. 获取元素
    var focus = document.querySelector('.focus');
    var ul = focus.children[0];
    // 获得focus 的宽度
    var w = focus.offsetWidth;
    var ol = focus.children[1];
    // 2. 利用定时器自动轮播图图片
    var index = 0;
    var timer = setInterval(function() {
      index++;
      var translatex = -index * w;
      ul.style.transition = 'all .3s';
      ul.style.transform = 'translateX(' + translatex + 'px)';
    }, 2000);
    // 等着我们过渡完成之后，再去判断 监听过渡完成的事件 transitionend
    ul.addEventListener('transitionend', function() {
      // 无缝滚动
      if (index >= 3) {
        index = 0;
        // console.log(index);
        // 去掉过渡效果 这样让我们的ul 快速的跳到目标位置
        ul.style.transition = 'none';
        // 利用最新的索引号乘以宽度 去滚动图片
        var translatex = -index * w;
        ul.style.transform = 'translateX(' + translatex + 'px)';
      } else if (index < 0) {
        index = 2;
        ul.style.transition = 'none';
        // 利用最新的索引号乘以宽度 去滚动图片
        var translatex = -index * w;
        ul.style.transform = 'translateX(' + translatex + 'px)';
      }
      // 3. 小圆点跟随变化
      // 把ol里面li带有current类名的选出来去掉类名 remove
      ol.querySelector('.current').classList.remove('current');
      // 让当前索引号 的小li 加上 current   add
      ol.children[index].classList.add('current');
    });

    // 4. 手指滑动轮播图
    // 触摸元素 touchstart： 获取手指初始坐标
    var startX = 0;
    var moveX = 0; // 后面我们会使用这个移动距离所以要定义一个全局变量
    var flag = false;
    ul.addEventListener('touchstart', function(e) {
      startX = e.targetTouches[0].pageX;
      // 手指触摸的时候就停止定时器
      clearInterval(timer);
    });
    // 移动手指 touchmove： 计算手指的滑动距离， 并且移动盒子
    ul.addEventListener('touchmove', function(e) {
      // 计算移动距离
      moveX = e.targetTouches[0].pageX - startX;
      // 移动盒子：  盒子原来的位置 + 手指移动的距离
      var translatex = -index * w + moveX;
      // 手指拖动的时候，不需要动画效果所以要取消过渡效果
      ul.style.transition = 'none';
      ul.style.transform = 'translateX(' + translatex + 'px)';
      flag = true; // 如果用户手指移动过我们再去判断否则不做判断效果
      e.preventDefault(); // 阻止滚动屏幕的行为
    });
    // 手指离开 根据移动距离去判断是回弹还是播放上一张下一张
    ul.addEventListener('touchend', function(e) {
      if (flag) {
        // (1) 如果移动距离大于50像素我们就播放上一张或者下一张
        if (Math.abs(moveX) > 50) {
          // 如果是右滑就是 播放上一张 moveX 是正值
          if (moveX > 0) {
            index--;
          } else {
            // 如果是左滑就是 播放下一张 moveX 是负值
            index++;
          }
          var translatex = -index * w;
          ul.style.transition = 'all .3s';
          ul.style.transform = 'translateX(' + translatex + 'px)';
        } else {
          // (2) 如果移动距离小于50像素我们就回弹
          var translatex = -index * w;
          ul.style.transition = 'all .1s';
          ul.style.transform = 'translateX(' + translatex + 'px)';
        }
      }
      // 手指离开的时候就重新开启定时器
      clearInterval(timer);
      timer = setInterval(function() {
        index++;
        var translatex = -index * w;
        ul.style.transition = 'all .3s';
        ul.style.transform = 'translateX(' + translatex + 'px)';
      }, 2000);
    });
  });
</script>

</html>